<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<table id="data-table" class="table table-striped table-bordered nowrap" width="100%">
    <thead>
    <tr>
        <td>测点ID</td>
        <td>回路名称</td>
        <td>额定功率</td>
        <td>互感器</td>
        <td>操作</td>
        <td>删除</td>
    </tr>
    </thead>

    <tbody>
    {volist name="monitor" id="v"}
    <tr>
        <td>{$v.monitor_id}</td>
        <td>{$v.loop_name}</td>
        <td>{$v.power}</td>
        <td>{$v.power}</td>
        <td><a name="getLoop" href="#getLoop_{$v.monitor_id}" data-toggle="modal">
            <i class="fa fa-folder-open">查看</i></a>
            <!--查看弹出框start-->
            <div class="modal modal-message fade" id="getLoop_{$v.monitor_id}">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                                ×
                            </button>
                            <h4 class="modal-title">测点信息</h4>
                        </div>
                        <div class="modal-body">
                            <div class="table-responsive">
                                <table class="table table-bordered nowrap" width="100%">
                                    <thead>
                                    <tr>
                                        <th colspan="1">测点ID</th>
                                        <th colspan="2">{$v.monitor_id}</th>
                                    </tr>
                                    <tr>
                                        <th colspan="1">电气回路名称</th>
                                        <th colspan="2">
                                            {$v.loop_name}
                                        </th>
                                    </tr>
                                    <tr>
                                        <th colspan="1">检测指标</th>
                                        <th colspan="1">额定值</th>
                                        <th colspan="1">传感器</th>
                                    </tr>
                                    </thead>

                                    <tbody>
                                    <tr>
                                        <td>...</td>
                                        <td>...</td>
                                        <td>...</td>
                                    </tr>
                                    <tr>
                                        <td>...</td>
                                        <td>...</td>
                                        <td>...</td>
                                    </tr>
                                    <tr>
                                        <td>...</td>
                                        <td>...</td>
                                        <td>...</td>
                                    </tr>
                                    <tr>
                                        <td>...</td>
                                        <td>...</td>
                                        <td>...</td>
                                    </tr>
                                    <tr>
                                        <td>...</td>
                                        <td>...</td>
                                        <td>...</td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <a href="javascript:;" class="btn btn-sm btn-white"
                               data-dismiss="modal">关闭</a>
                            <a href="javascript:;" class="btn btn-sm btn-primary">保存更改</a>
                        </div>
                    </div>
                </div>
            </div>
            <!--查看弹出框end-->
            |<a name="editLoop" id="editLoop_{$v.monitor_id}" href="#edit-modal" data-toggle="modal">
                <i class="fa fa-pencil">编辑</i></a>
            <!--编辑弹出框start-->
            <div class="modal modal-message fade" id="edit-modal">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                                ×
                            </button>
                            <h4 class="modal-title">测点信息</h4>
                        </div>
                        <div class="modal-body">
                            <div class="table-responsive">
                                <form action="/admin/system/test" method="post">
                                    <table class="table table-bordered nowrap" width="100%">
                                        <thead>
                                        <tr>
                                            <th colspan="1">测点ID</th>
                                            <th colspan="2">{$v.monitor_id}</th>
                                        </tr>
                                        <tr>
                                            <th colspan="1">电气回路名称</th>
                                            <th colspan="2">
                                                {$v.loop_name}
                                            </th>
                                        </tr>
                                        <tr>
                                            <th colspan="1">检测指标</th>
                                            <th colspan="1">额定值</th>
                                            <th colspan="1">传感器</th>
                                        </tr>
                                        </thead>

                                        <tbody>
                                        <tr>
                                            <td>功率</td>
                                            <td><input name="power" class="form-control" type="text">
                                            </td>
                                            <td><input name="power_sen" class="form-control"
                                                       type="text"></td>
                                        </tr>
                                        <tr>
                                            <td>电压</td>
                                            <td><input name="voltage" class="form-control" type="text">
                                            </td>
                                            <td><input name="voltage_sen" class="form-control"
                                                       type="text"></td>
                                        </tr>
                                        <tr>
                                            <td>A相电流</td>
                                            <td><input name="current_a" class="form-control"
                                                       type="text"></td>
                                            <td><input name="current_a_sen" class="form-control"
                                                       type="text"></td>
                                        </tr>
                                        <tr>
                                            <td>B相电流</td>
                                            <td><input name="current_b" class="form-control"
                                                       type="text"></td>
                                            <td><input name="current_b_sen" class="form-control"
                                                       type="text"></td>
                                        </tr>
                                        <tr>
                                            <td>C相电流</td>
                                            <td><input name="current_c" class="form-control"
                                                       type="text"></td>
                                            <td><input name="current_c_sen" class="form-control"
                                                       type="text"></td>
                                        </tr>
                                        <tr>
                                            <td>剩余电流</td>
                                            <td><input name="resi_current" class="form-control"
                                                       type="text"></td>
                                            <td><input name="resi_current_sen" class="form-control"
                                                       type="text"></td>
                                        </tr>
                                        <tr>
                                            <td>电缆温度</td>
                                            <td><input name="cable_temp" class="form-control"
                                                       type="text"></td>
                                            <td><input name="cable_temp_sen" class="form-control"
                                                       type="text"></td>
                                        </tr>
                                        </tbody>
                                    </table>
                                    <input type="submit">
                                </form>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <a href="javascript:;" class="btn btn-sm btn-white"
                               data-dismiss="modal">关闭</a>
                            <a href="javascript:;" class="btn btn-sm btn-primary">保存更改</a>
                        </div>
                    </div>
                </div>
            </div>
            <!--编辑弹出框end-->
        </td>
        <td>
            <a name="delete" id="{$v.monitor_id}" href="#delete-modal" data-toggle="modal">
                <i class="fa fa-trash-o">删除</i> </a>
        </td>
    </tr>
    {/volist}
    <!-- 删除弹出框start -->
    <div class="modal fade" id="delete-modal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"
                            aria-hidden="true">×
                    </button>
                    <h4 class="modal-title">警告</h4>
                </div>
                <div class="modal-body">
                    <div class="alert alert-danger m-b-0">
                        <h4><i class="fa fa-info-circle"></i> 是否确认删除当前用户？</h4>
                    </div>
                </div>
                <div class="modal-footer">
                    <a href="javascript:;" class="btn btn-sm btn-white"
                       data-dismiss="modal">关闭</a>
                    <a name="delete_monitor" class="btn btn-sm btn-danger"
                       data-dismiss="modal">删除</a>
                </div>
            </div>
        </div>
    </div>
    <!-- 删除弹出框end -->
    </tbody>
</table>
</body>
</html>
<script>
    $(document).ready(function () {
        TableManageTableTools.init();
        //删除记录操作
        $("a[name='delete']").each(function () {
            var id = $(this).attr('id');
            var DOM = $(this).parent().parent();
            $(this).click(function () {
                if ($('#delete-modal').children().children().children().eq(2).children().eq(1).click) {
                    $(function () {
                        $.ajax({
                            url: '/admin/system/delete_monitor',
                            type: 'post',
                            data: {id: id},
                            timeout: 5000,
                            success: function (data) {
                                if (data == 'success') {
                                    $(document).ready(function () {
                                        DOM.remove();
                                    })
                                } else {
                                    alert('删除失败');
                                }
                            },
                            error: function () {
                                alert('502');
                            }
                        })
                    })
                }
            })
        });

        var monitorInfo = JSON.parse('<?php echo json_encode($monitor);?>');
        $("a[name='editLoop']").each(function () {
            var id = $(this).attr('id').split('_')[1];
            $(this).click(function () {
                console.log(monitorInfo.data[0]);
            })
        })
    });
</script>